<template>
  <el-dialog
    top="30px"
    width="800px"
    class="dialog-sm"
    append-to-body
    title="通知公告"
    :visible.sync="visible"
    :close-on-click-modal="false"
    :before-close="beforeClose"
  >
    <div class="text-center mb-5">
      <h5>{{ formData.notice_placard_title }}</h5>
      <div>
        <i class="fa fa-clock-o"></i>
        {{ $utils.dateFormat(formData.create_time, 'yyyy.MM.dd') }}
      </div>
    </div>

    <div v-html="formData.content" class="quill-content"></div>

    <div v-if="attachment.length" class="mt-5">附件：</div>
    <div>
      <div v-for="(p, index) of attachment" :key="index">
        <a :href="p.url" target="_blank">{{ p.name }}</a>
      </div>
    </div>
  </el-dialog>
</template>

<script>
import { arrayFromString } from '@vimi/utils-tool'
export default {
  props: {
    visible: Boolean,
    formData: { type: Object, default: () => ({}) },
  },
  computed: {
    attachment() {
      const arr = arrayFromString(this.formData.attachment)
      return arr.map(item => {
        return {
          url: item,
          name: item.replace(/.*\/(.*)$/, '$1'),
        }
      })
    },
  },
  data() {
    return {}
  },

  created() {},
  methods: {
    beforeClose() {
      this.$emit('update:visible', false)
    },
  },
}
</script>
<style lang="scss" scoped>
.quill-content {
  white-space: pre-wrap;
  overflow: hidden;
}
</style>
